<template>
	<!-- <view> -->
		<view class="indicatorsBox">
			<view class="flex_between_row">
				<view>设备参数</view>
				<view>当前值</view>
				<view>状态判断</view>
			</view>
		  	<view class="flex_between_row" :class="{isWrong:equipMonitorData.speed[1] != '正常'&& equipMonitorData.speed[0] != ''}">
				<text>泵转速</text>
				<text>{{equipMonitorData.speed[0] || '--'}}r/s</text>
				<text>{{equipMonitorData.speed[1]  || '正常'}}</text>
			</view>
			<view class="flex_between_row" :class="{isWrong:equipMonitorData.voltage[1] != '正常'&& equipMonitorData.voltage[0] != ''}">
				<text>电池电压</text>
				<text>{{equipMonitorData.voltage[0]  || '--'}}V</text>
				<text>{{equipMonitorData.voltage[1]  || '正常'}}</text>
			</view>

<!-- 			<view class="flex_between_row">
				{{equipMonitorData.guard || '--'}}
				<text>防盗状态</text>
			</view> -->
<!-- 			<view class="flex_between_row">
				<text>激光超时</text>
				<text>{{equipMonitorData.laserTimeout || '--'}}</text>
				<text>{{equipMonitorData.laserTimeout || '--'}}</text>
			</view> -->
			<view class="flex_between_row" :class="{isWrong:equipMonitorData.temperature[1] != '正常'&& equipMonitorData.temperature[0] != ''}">
				<text>温度</text>
				<text>{{equipMonitorData.temperature[0] || '--'}}℃</text>
				<text>{{equipMonitorData.temperature[1] || '正常'}}</text>
			</view>
			<view class="flex_between_row" :class="{isWrong:equipMonitorData.humidity[1] != '正常'&& equipMonitorData.humidity[0] != ''}">
				<text>湿度</text>
				<text>{{equipMonitorData.humidity[0] || '--'}}%RH</text>
				<text>{{equipMonitorData.humidity[1] || '正常'}}</text>
			</view>
			<view class="flex_between_row" :class="{isWrong:equipMonitorData.signal[1] != '正常'&& equipMonitorData.humidity[0] != ''}">
				<text>信号强度</text>
				<text>{{equipMonitorData.signal[0] || '--'}}</text>
				<text>{{equipMonitorData.signal[1] || '正常'}}</text>
			</view>
			<view class="flex_between_row" :class="{isWrong:equipMonitorData.water[1] != '正常'&& equipMonitorData.water[0] != ''}">
				<text>是否浸水</text>
				<text>{{equipMonitorData.water[0] || '--'}}</text>
				<text>{{equipMonitorData.water[1] || '正常'}}</text>
			</view>
			<view class="flex_between_row" :class="{isWrong:equipMonitorData.liquid[1] != '正常'&& equipMonitorData.liquid != ''}">
				<text>液位</text>
				<text>{{equipMonitorData.liquid[0] || '--'}}cm</text>
				<text>{{equipMonitorData.liquid[1] || '正常'}}</text>
			</view>
			<view class="flex_between_row" :class="{isWrong:!equipMonitorData.flow.length}">
				<text>流量</text>
				<text>{{equipMonitorData.flow}}m3/h</text>
				<text>{{equipMonitorData.flow.length?"正常" : '异常'}}</text>
			</view>
			<view class="flex_between_row" :class="{isWrong:equipMonitorData.laseraAnomaly != '正常' && equipMonitorData.netStatus != ''}">
				<text>激光光强</text>
				<text>{{'--'}}</text>
				<text>{{equipMonitorData.laseraAnomaly}}</text>
			</view>
			<view class="flex_between_row" :class="{isWrong:equipMonitorData.netStatus != '正常' && equipMonitorData.netStatus != ''}">
				<text>网络状态</text>
				<text>{{'--'}}</text>
				<text>{{equipMonitorData.netStatus || '正常'}}</text>
			</view>
	
		</view>
	<!-- 	<view>
			<text>数据时间 : {{equipMonitorData.datatime || '--'}}</text>
		</view> -->
	<!-- </view> -->
</template>

<script>
export default {
	data() {
		return {
			equipMonitorData:{
			  "msg": "success",
			  "datalength": 0,
			  "datatime": "2020-08-11 20:37:33",
			  // "guard": "否",
			  // "temperature": "27.0",
			  // "humidity": "84.0",
			  // "realdata": "0.00%VOL",
			  "signal": "10.0",
			  // "water": "是",
			  // "speed": "0.0",
			  // "voltage": "3.7"
			}
		};
	},
	props:{
		equipmentCode:{
			type:String,
			default:''
		},
	},
	watch:{
		equipmentCode(newVal){
			this.equipMonitorIndexFn(newVal)
		}
	},
	methods: {
		equipMonitorIndexFn(equipmentCode){
			this.$api.equipMonitorIndex({
				equipmentCode
			}).then(res => {
				this.equipMonitorData = res.data
				//console.log('this.equipMonitorData',this.equipMonitorData)
			})
		}
	}
};
</script>

<style lang="scss" scoped>
text{
	color: #666;
	font-size: 28rpx;
}
.indicatorsBox{
	padding: 0;
	border-top:2rpx solid $uni-bg-color-grey;
	padding-top: 20rpx;
	view{
		color: #999;
		font-size: 28rpx;
	}
	.flex_between_row{
		height: 88rpx;
		font-size: 28rpx;
		margin: 0 $uni-spacing-col-36;
		border-bottom: 2rpx solid #F1F1F1;
		&:first-child{
			// border-bottom: 2rpx solid #F1F1F1;
			margin: 0;
			padding: 0 $uni-spacing-col-36;
			text{
				color: #666 !important;
			}
		}
		text{
			font-size: 28rpx;
			text-align: left;
			width: 150rpx;
			color: $uni-color-success;
			&:first-child{
				color: $uni-text-color-black;
			}
			&:nth-child(2){
			}
			&:last-child{
				background: #E6F8ED;
				color: $uni-color-success;
				height: 42rpx;
				line-height: 42rpx;
				border-radius: 42rpx;
				width: 96rpx;
				text-align: center;
				font-size: 28rpx;
			}
		}

	}
	.isWrong{
		text{
			&:nth-child(2),
			&:last-child{
				color: #F32B00;
				
			}
			&:last-child{
				background: #FFEFEB;
			}
		}
	}
}

</style>
